import React, { Component, Fragment } from 'react';
import { inject, observer } from 'mobx-react';
import { HashRouter, Switch, Route, Redirect, withRouter } from 'react-router-dom';

import Layout from '@pages/Layout';
import LoginLayout from '@pages/Login';
import { GlobalLoading } from '@/components/Loading';

@inject('globalStore', 'layoutStore')
@observer
export default class Index extends Component {

    constructor(props) {
        super(props);
        this.globalStore = props.globalStore;
        window.logger = (data)=> {
            props.layoutStore.logger(data)
        }
    }
    render() {
        return (
            <Fragment>
                <HashRouter>
                    <Switch>
                        <Route path="/login" exact component={LoginLayout} />
                        <Route path="/join" exact component={LoginLayout} />
                        <Route path="/" component={Layout} />
                    </Switch>
                </HashRouter>
                {
                    this.globalStore.isShowGlobalLoading && <GlobalLoading type="loader1" style={{fontSize: '40px'}} />
                }
            </Fragment>
        );
    }
}
